<template>
  <view class="container">
    <!-- 图片列表 -->
    <view class="image-list">
      <view class="image-item" v-for="(item, index) in productCaList" :key="index">
        <image :src="item.file_path" class="image" :alt="item.alt" @click="gotoPageAgent(item.url)"></image>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      // 定义一个包含图片列表的数据
      productCaList: [],
    };
  },
  onLoad(e) {
	  this.init();
  	//this.getData();
  },
  methods: {
	  init(){
		  let self = this;
		  self.loading = true;
		  self._get('index/getSysConfig', {}, function(res) {
		  	self.loading = false;
		  	self.productCaList = res.data.open_member_banner;
		  });
	  },
	  /*获取数据*/
	  getData() {
	  	let self = this;
	  	self.loading = true;
	  	self._get('product.category/fx_grade_index', {}, function(res) {
	  		self.loading = false;
	  		self.productCaList = res.data.list;
	  	});
	  },
      // 跳转页面的方法
      gotoPageAgent(url) {
        uni.navigateTo({
          //url: `/pages/index/agentproduct?category_id=${type}`
		  url: url
        });
      }
  }
};
</script>

<style scoped>
.container {
  padding: 10px;
}

.image-list {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.image-item {
  margin: 10px;
  width: 100%;
}

.image {
  height: 120px;
  object-fit: cover;
  border-radius: 8px;
  width: 100%;
}
</style>
